<tc_include file="Portal/Public/style" />
    <title>详情页</title>
    <style>
        body{background: #eee;}
        .cxxq_wrap{width: 800px; padding:30px 80px; margin-top: 20px; background: #fff; margin-right: auto; margin-left: auto;}
        .cxxq_box{}
        .cxxq_box .bimg{height:440px;text-align: center; margin-top:30px; margin-bottom:30px;}
        .cxxq_box .bimg img{height:100%; max-width: 100%; display: block; margin:0 auto;}
        .cxxq_box .simgs img{height:60px; width: 60px; padding:2px; cursor: pointer; border:2px solid #fff;}
        .cxxq_box .simgs img.on{height:60px; width: 60px; padding:2px; cursor: pointer; border:2px solid #ee1c25;}
        .cxxq_box .pingls{background: #f2f2f6; position: relative; border:1px solid #ccc; padding-left:20px; padding-right:20px; margin-top: 20px;}
        .cxxq_box .pingls .ding{position: absolute; right:0; top:-8px; margin-right: 20px;}
        .cxxq_box .pltop{padding:16px 0; overflow: hidden; border-bottom: 1px solid #ccc;}
        .cxxq_box .pltop img{width: 40px; height: 40px; border-radius: 50%; float: left;}
        .cxxq_box .pltop .txt{float: left; margin-left: 16px;height: 38px; border:1px solid #ccc; background: #fff; width:560px; padding:0 20px;}
        .cxxq_box .pltop .btn{float: right; height: 40px;  background: #ee1c25; width:80px; font-size: 16px; color: #fff; }
        .cxxq_box .plMode {overflow: hidden; padding:16px 0;}
        .cxxq_box .plMode img{float: left; width: 40px; height: 40px; border-radius: 50%;}
        .cxxq_box .plMode .hf{ margin:0 16px; padding:6px 0; border-bottom: 1px solid #ccc;}
        .cxxq_box .plModeCont{ margin-left: 56px; }
        .cxxq_box .plModeCont .xbot{}
        .cxxq_box .plModeCont .xtit{ color: #333; font-size: 12px; line-height: 22px;}
        .cxxq_box .plModeCont .xtit span{ color: #376ab7; font-size: 14px; }
        .cxxq_box .plModeCont .xtime{ color: #999; font-size: 12px; padding-top: 4px; }
        .cxxq_box .plModeCont .xhf{ color: #333; font-size: 12px; cursor: pointer; }
        .cxxq_box .plModeCont .xline{ color: #ddd; font-size: 10px; margin:0 4px; }
        .cxxq_box .plModeCont .xzan{ color: #333; font-size: 12px; cursor: pointer; display: inline-block; padding-left:22px; background: url("__IMG__/zan.png") no-repeat 0 center;}
        .cxxq_box .hf_boc{margin-top: 10px;  background: #eaeaec;  margin-left: 57px;}
        .cxxq_box .hf_boc .zhedie{ margin:0 16px; padding:10px 0; color: #376ab7; font-size: 12px; cursor: pointer;}
    </style>
<tc_include file="Portal/Public/header" />
<!--header end-->
<div class="oh main pb40">
    <div class="hot_left cxxq_wrap" >
        <div class="hot_cont pt20">
            <div class="hot_cont_mode">
                <div class="top_tit">
                    <img class="photo" src="__IMG__/pt1.png" alt=""/>
                    <div class="fl">
                        <p class="tit">神奇的世界</p>
                        <p class="time">09-14 09:32</p>
                    </div>
                    <div class="xin">
                        <img src="__IMG__/xin.png" alt=""/>
                        <img class="none" src="__IMG__/xina.png" alt=""/>
                    </div>
                </div>
                <div class="article_tit">人本数据和感知计算是大数据发展方向</div>
                <div class="article_txt">
                    <span class="art_length">大数据技术的战略意义不在于掌握庞大的数据信息，而在于对这些含有意义的数据进行专业化处理。换而言之，如果把大数据比作一种产业，那么这种产业实现盈利的关键，在于提高对数据的“加工能力”，通过“加工”实现数据的“增值”</span><span class="zkbtn none">...展开</span>
                </div>
                <div class="cxxq_box">
                    <div class="bimg"><img src="__IMG__/img1.jpg" alt=""/></div>
                    <div class="simgs mb20">
                        <img class="on" src="__IMG__/img10.jpg" alt=""/>
                        <img src="__IMG__/img11.jpg" alt=""/>
                        <img src="__IMG__/img12.jpg" alt=""/>
                        <img src="__IMG__/img10.jpg" alt=""/>
                        <img src="__IMG__/img11.jpg" alt=""/>
                        <img src="__IMG__/img12.jpg" alt=""/>
                    </div>
                    <div class="article_bot">
                        <span class="views" style="margin-left:0;">浏览 12313</span>
                        <span class="msg">124</span>
                        <span class="zan">13</span>
                    </div>
                    <div class="pingls">
                        <img class="ding" src="__IMG__/ding.png" alt=""/>
                        <div class="pltop">
                            <img src="__IMG__/pt3.png"  alt=""/>
                            <input class="txt" type="text" placeholder="" />
                            <input class="btn" type="button" value="评论"/>
                        </div>
                        <div class="plcont">
                            <div class="plMode">
                                <div class="fy">
                                    <img src="__IMG__/pt5.png" alt=""/>
                                    <div class="plModeCont">
                                        <div class="xtit"><span>神奇的世界</span>：内心的世界，好美好美！！大数据技术的战略意义不在于掌握庞大的数据信息，而在于对这些含有意义的数据进行专业化处理。换而言之，如果把大数据比作一种产业，那么这种产业实现盈利的关键大数据技术的战略意义不在于掌握庞大的数据信息，而在于对这些含有意义的数据进行专业化处理。换而言之，如果把大数据比作一种产业，那么这种产业实现盈利的关键</div>
                                        <div class="xbot oh">
                                            <div class="xtime fl">08-10 9:32</div>
                                            <div class="fr">
                                                <span class="xhf">回复</span>
                                                <span class="xline">|</span>
                                                <span class="xzan">赞</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="hf_boc">
                                    <div class="plModeCont hf">
                                        <div class="xtit"><span>神奇的世界</span>：内心的世界，好美好美！！</div>
                                        <div class="xbot oh">
                                            <div class="xtime fl">08-10 9:32</div>
                                            <div class="fr">
                                                <span class="xhf">回复</span>
                                                <span class="xline">|</span>
                                                <span class="xzan">赞</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="plModeCont hf">
                                        <div class="xtit"><span>神奇的世界</span>：内心的世界，好美好美！！</div>
                                        <div class="xbot oh">
                                            <div class="xtime fl">08-10 9:32</div>
                                            <div class="fr">
                                                <span class="xhf">回复</span>
                                                <span class="xline">|</span>
                                                <span class="xzan">赞</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="plModeCont hf">
                                        <div class="xtit"><span>神奇的世界</span>：内心的世界，好美好美！！</div>
                                        <div class="xbot oh">
                                            <div class="xtime fl">08-10 9:32</div>
                                            <div class="fr">
                                                <span class="xhf">回复</span>
                                                <span class="xline">|</span>
                                                <span class="xzan">赞</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="plModeCont hf none">
                                        <div class="xtit"><span>神奇的世界</span>：内心的世界，好美好美！！</div>
                                        <div class="xbot oh">
                                            <div class="xtime fl">08-10 9:32</div>
                                            <div class="fr">
                                                <span class="xhf">回复</span>
                                                <span class="xline">|</span>
                                                <span class="xzan">赞</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="zhedie" data-state="1">展开所有回复</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <div class="hot_cont_mode">
                <div class="top_tit">
                    <img class="photo" src="__IMG__/pt1.png" alt=""/>
                    <div class="fl">
                        <p class="tit">神奇的世界</p>
                        <p class="time">09-14 09:32</p>
                    </div>
                    <div class="xin">
                        <img class="none" src="__IMG__/xin.png" alt=""/>
                        <img  src="__IMG__/xina.png" alt=""/>
                    </div>
                </div>
                <div class="article_tit">人本数据和感知计算是大数据发展方向</div>
                <div class="article_txt"><span class="art_length">大数据技术的战略意义不在于掌握庞大的数据信息，而在于对这些含有意义的数据进行专业化处理。换而言之，如果把大数据比作一种产业，那么这种产业实现盈利的关键，在于提高对数据的“加工能力”，通过“加工”实现数据的“增值”在于提高对数据的</span><span class="zkbtn none">...展开</span></div>
                <div class="article_mp4">
                    <img class="play_btn" src="__IMG__/play_btn.png" width="72" height="72" alt=""/>
                    <img src="__IMG__/mp4_img.jpg" alt=""/>
                </div>
                <div class="article_bot">
                    <span class="views">浏览 12313</span>
                    <span class="msg">124</span>
                    <span class="zan">13</span>
                </div>
            </div>
        </div>
    </div>
</div>

<!--footer-->
<tc_include file="Portal/Public/footer" />
<script>
$(".art_length").each(function(){
    var txt = $(this).text();
    var len = txt.length;
    if(len>106){
        $(this).text(txt.substr(0,106));
        $(this).data("alls",txt);
        $(this).siblings(".zkbtn").show()
    }
});
$(".zkbtn").click(function(){
    var alls = $(this).siblings(".art_length").data("alls");
    $(this).siblings(".art_length").text(alls);
    $(this).hide();
});


$(".zhedie").click(function(){
    var state = $(this).data("state");
    if(state == 1){
        $(this).siblings(".hf").removeClass("none");
        $(this).data("state",2);
        $(this).text("折叠回复");
    }else{
        $(".hf_boc .hf").each(function(i){
            if(i >= 3){
                $(this).addClass("none");
            }
        });
        $(this).data("state",1);
        $(this).text("展开所有回复");
    }

})

    $(".simgs img").click(function(){
        $(this).addClass("on").siblings().removeClass("on");
        var src = $(this).attr("src");
        $(".bimg img").attr("src",src);
    })
</script>
</body>
</html>